<template>
	<div class="Search">
		<form>
			<input type="text" class="text" placeholder="Monthagne jeunesse"/>
			<input type="submit"  class="submit" value=""/>
		</form>
	</div>
</template>

<script>
	export default{
		name:"Search"
	}
</script>

<style lang="scss" scoped>
.Search{
	width: 516px;
	height: 60px;
	position: relative;
	border-radius: 13px;
	overflow:hidden;
	
	&::after{
		position: absolute;
		content:"";
		width:inherit;
		height:inherit;
		display:block;
		background: #fff;
		opacity: 0.7;
		z-index:1;
	}
     form{
     	position:absolute;
		 width: inherit;
		 height: inherit;
		 background: none;
		 z-index: 2;
	    input{
			height:inherit;
			float: left;
			background: none;
		}
		.text{
				width:437px;
				font-size:28.13px;
				color: #999999;
				padding-left: 20px;
			}
		.submit{
				width: 59px;
				background: url('~img/common/search.png') no-repeat left;
				background-size: 38px;
			}
			
	}
	
}
</style>